<template>
	<view class="main">
		<view class="menu_list">
			<view v-for="(item, index) in menuList" :key="index" @click="menuClick(item)">
				<image v-if="index == 0" class="avatar_img" :src="item.remark" mode="aspectFill" />
				<view v-if="item.isShow && index != 0" class="menu_item flex_column c333" v-cloak>
					<text class="title ">{{ item.name }}</text>
					<view class="remark fz32 mt30 ellipsis1">
						{{ item.remark }}
					</view>
				</view>
			</view>
		</view>
	</view>
</template>

<script type="text/javascript" src="plus-confusion://../pages/my/homePage/edit"></script>

<style lang="scss" scoped>
.main {
	position: relative;
	min-height: 100vh;
	background-color: #fff;
	padding-top: 20rpx;

	.menu_list {
		padding: 0 30rpx;

		.avatar_img {
			display: block;
			margin: 68rpx auto 58rpx;
			width: 120rpx;
			height: 120rpx;
			border-radius: 50%;
			background-color: #D8D8D8;
		}

		.menu_item {
			padding: 30rpx 0;
			background: #ffffff;
			border-bottom: 1rpx solid #D8D8D8;

			.title {
				color: rgba(0, 0, 0, 0.8);
				font-size: 22rpx;
			}

			.remark {
				line-height: 32rpx;
			}
		}
	}
}



[v-cloak] {
	display: none;
}
</style>
